<template>
	<view class="bg-white">
		<!-- 小程序顶部样式 -->
		<cu-custom bgColor="bg-blue" :isBack="true">
			<block slot="content">面试详情</block>
		</cu-custom>
		
		<view v-if="interviewData.companyInfo">
			<view class="padding flex align-center solid-bottom">
				<view>
					<img class="border solid radius" mode="scaleToFill" :src="handleImg()" alt=""
					style="width: 120rpx; height: 120rpx;">
				</view>
				<view class="margin-left">
					<view class="text-bold" style="font-size: 30rpx;margin: 10rpx;">
						<text>
							{{ interviewData.companyInfo.name }}
						</text>
						<text class="rate margin-left">
							{{ interviewData.companyInfo.userstars }}分
						</text>
					</view>
					<view v-if="interviewData.companyInfo.infos" class="text-gray" style="font-size: 25rpx;margin-top: 30rpx;">
						{{ interviewData.companyInfo.infos }}条面试真经
					</view>
				</view>
			</view>
			
			<view class="cu-card article no-card margin-top">
				<view class="cu-item shadow">
					<view class="padding flex align-center">
						<image
						style="width: 80rpx; height: 80rpx; border-radius: 50%;"
						src="https://www.newzhihu.com/mvue/image/userImg.png"
						mode="aspectFill"></image>
						<view style="margin-left: 30rpx;">
							<view class="text-cut">
								{{ interviewData.mianshi_info.username }}
							</view>
							<view class="text-gray" style="font-size: 25rpx;">
								{{ interviewData.mianshi_info.userdes }}
							</view>
						</view>
					</view>
					<view class="content flex-direction">
						<view class="desc solid-bottom">
							<view class="text-content"> 
								{{ interviewData.mianshi_info.ms_content }}
							</view>
						</view>
						<view class="flex justify-between align-center" style="margin-top: 20rpx;">
							<view class="text-gray" style="font-size:25rpx">
								阅读量: {{ interviewData.mianshi_info.allRead }}
							</view>
						</view>
					</view>
				</view>
			</view>
			
			<view class="padding flex">
				<view class="text-gray">
					点赞({{ interviewData.mianshi_info.allZanC }})
				</view>
				<view class="text-gray margin-left">
					评论({{ interviewData.mianshi_comment_count }})
				</view>
			</view>
			
			<!-- todo 评论列表 -->
		</view>
	</view>
</template>

<script>
	export default {
		watch: {
			loading(newValue, oldValue) {
				if(newValue){
					uni.showLoading({
						title: '加载中'
					});
				}else{
					uni.hideLoading();
				}
			}
		},
		data() {
			return {
				loading: false,
				interviewId: '',
				interviewData: {}
			}
		},
		onLoad(option) {
			if(option.interviewId){
				this.interviewId = option.interviewId
			}
			this.fatchData()
		},
		methods: {
			handleImg(){
				return this.$api.baseUrl + this.interviewData.companyInfo.logo
			},
			async fatchData(){
				this.loading = true
				let res = await this.$api.queryInterviewDetail({
					key: this.$util.getKey(),
					mianshi_id: this.interviewId,
					uid: this.$util.getUid()
				})
				this.loading = false
				if(res && res.data && res.data.data){
					this.interviewData = res.data.data
				}
			}
		}
	}
</script>

<style>

</style>
